// components/test3/test3.js
Component({
  /**
   * 组件的属性列表
   */
  options: {
    pureDataPattern: /^_/
  },
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    // rgb:{
    //   r:0,
    //   g:0,
    //   b:0
    // },
    _rgb: {
      r: 0,
      g: 0,
      b: 0
    },
    fullColor: '0,0,0',
    value: '',
    _a: 1 //纯数据字段只能用于页面逻辑处理，不能进行渲染
  },

  /**
   * 组件的方法列表
   */
  methods: {
    //生成随机RGB颜色的方法。非事件处理函数建议以_开头
    _randomColor() {
      this.setData({
        _rgb:{
          r:Math.floor(Math.random() * 256),
          g:Math.floor(Math.random() * 256),
          b:Math.floor(Math.random() * 256)
        }
      })
    },
    changeIpt(e) {
      this.setData({
        value: e.detail.value
      })
    },
    changeR() {
      this.setData({
        '_rgb.r': this.data._rgb.r + 5 > 255 ? 255 : this.data._rgb.r + 5
      })
    },
    changeG() {
      this.setData({
        '_rgb.g': this.data._rgb.g + 5 > 255 ? 255 : this.data._rgb.g + 5
      })
    },
    changeB() {
      this.setData({
        '_rgb.b': this.data._rgb.b + 5 > 255 ? 255 : this.data._rgb.b + 5
      })
    },
  },
  observers: {
    // 'rgb.r,rgb.g,rgb.b':function(r,g,b) {
    //   this.setData({
    //     fullColor:`${r},${g},${b}`
    //   })
    // }
    '_rgb.**': function (obj) {
      this.setData({
        fullColor: `${obj.r},${obj.g},${obj.b}`
      })
    }
  },
  // lifetimes: {
  //   created() {
  //     console.log(1);
  //   },
  //   attached() {
  //     console.log(2);
  //   }
  // },
  pageLifetimes:{
    show() {
      this._randomColor()
    },
    hide() {},
    resize() {}
  }
})